<template>
	<div>
		<div class="layout-breadcrumb">
			<Breadcrumb>
			    <BreadcrumbItem to="/">首页</BreadcrumbItem>
			    <BreadcrumbItem href="">系统配置</BreadcrumbItem>
			    <BreadcrumbItem href="/config/config">公共配置</BreadcrumbItem>
			</Breadcrumb>
		</div>
		<div class="layout-content">
		    <div class="layout-content-main">
		    	<Alert type="warning">系统全局配置库、如不明白,请勿进行任何操作。系统全局设置保存地,用于一些功能设置。</Alert>
		    	<Row>
		    		<ICol span="6"><IButton type="primary" @click="$refs.update.modal=true">添加新配置</IButton></ICol>
					<ICol span="6" offset="11"><Search :callback="resetTable"></Search></ICol>
		    	</Row>
		    	<BaseTable ref="table" :url="table.url" :header="table.header" ></BaseTable>
		    	<Update ref="update" :callback="resetTable"></Update>
		    </div>
		</div>
	</div>
</template>
<script>
import {Row,Col,Breadcrumb,Alert,Button} from 'iview';

import BaseTable  from 'admin/components/table/base';
import Update from 'admin/components/config/config/update';
import Search from 'admin/components/config/config/search';

export default{
	components:{
		Row,
        'ICol':Col,
        Breadcrumb,
        'BreadcrumbItem' : Breadcrumb.Item,
        BaseTable,
        Alert,
        'IButton':Button,
        Update,
        Search
    },
    data () {
        return {
        	table:{
        		url : '/config/config/view/list',
        		header: []
        	},
        }
    },
    methods:{
    	resetTable(params){
    		this.$refs.table.tableData(params);
    	},
    },
    created:function(){
    	this.table.header =  [
            {
		        title: '配置名',
		        key: 'key'
		    },
		    {
		        title: '配置值',
		        key: 'vue'
		    },
		    {
		        title: '开关',
		        key: 'switch',
		        render: (h, params) => {
		        	return params.row.switch==1 ? '开' : '关';
		        }
		    },
		    {
		        title: '状态',
		        key: 'status'
		    },
		    {
		        title: '类型',
		        key: 'type'
		    },
		    {
		        title: '描述',
		        key: 'desc'
		    },
		    {
		        title: '操作',
		        key: 'action',
		        width: 150,
		        align: 'center',
		        render: (h, params) => {
		            return h('div', [
		                h(Button, {
		                    props: {
		                        type: 'primary',
		                        size: 'small'
		                    },
		                    style: {
		                        marginRight: '5px'
		                    },
		                    on: {
		                        click: () => {
		                        	var update = this.$refs['update'];
		                        	this.Axios.Config.Config.Get(params.row.id)
						            .then(res =>{
						                if(!res) return false;
						                var data = res.data;
										update.form.id     = params.row.id;
										update.form.key    = data['key'];
										update.form.vue    = data['vue'];
										update.form.switch = data['switch']==1 ? true : false;
										update.form.status = data['status'];
										update.form.type   = data['type'];
										update.form.desc   = data['desc'];
						                update.modal = true;
						            })
		                        }
		                    }
		                }, '编辑'),
		                h(Button, {
		                    props: {
		                        type: 'error',
		                        size: 'small'
		                    },
		                    on: {
		                        click: () => {
		                        	this.$Modal.confirm({
					                    title: '你确定要删除吗？',
					                    content: '一旦删除无法恢复',
					                    onOk: () => {
					                        this.Axios.Config.Config.Del(params.row.id)
								            .then(res =>{
								                if(!res) return false;
								                this.$refs.table.tableRowDel = true;
								                this.$refs['table'].tableData();
								            })
					                    }
					                });
		                        }
		                    }
		                }, '删除')
		            ]);
		        }
		    }
        ];
    },
    mounted:function(){
    	this.$store.dispatch('CHANGE_ROUTE',{name:'公共配置',route:'/config/config',action:1,closable:true});
    },

}
</script>